<!DOCTYPE html>
<html lang="zh-cmn-Hans">

	<head>
		<meta charset="UTF-8">
		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
		<meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" name="viewport">
		<script type="text/javascript" src="Plug/jquery-1.11.3.min.js"></script>
		<title>活动通告</title>
		<script src="Plug/layer-v3.1.1/layer.js" type="text/javascript" charset="utf-8"></script>
		<!--layer  弹框插件-->
		<link rel="stylesheet" href="static/css/base/reset.css" />
		<!--jqyery-weiui插件 -->
		<link rel="stylesheet" href="Plug/jquery-weui/jquery-weui.min.css">
		<link rel="stylesheet" href="Plug/jquery-weui/weui.min.css">
		<script src="Plug/jquery-weui/js/jquery-weui.js" type="text/javascript" charset="utf-8"></script>
		<script src="Plug/jquery-weui/js/city-picker.js" type="text/javascript" charset="utf-8"></script>
		<!--轮播插件-->
		<link rel="stylesheet" type="text/css" href="Plug/swiper/swiper.min.css" />
		<script src="Plug/swiper/swiper.min.js" type="text/javascript" charset="utf-8"></script>
		<!--重置样式-->
		<link rel="stylesheet" href="static/css/base/main.css" />
		<!--公共样式-->
		<link rel="stylesheet" type="text/css" href="http://at.alicdn.com/t/font_990287_0yboerxjx8xc.css" />
		<!--阿里云图标库-->
		<script src="static/js/base.js" type="text/javascript" charset="utf-8"></script>
		<!---------------公共导入分割线------------------------>
		<!--本页样式-->
		<link rel="stylesheet" href="static/css/login/index.css" />
		<link rel="stylesheet" href="static/css/index_into/index_into.css" />
	</head>

	<body>
		<!--存在bar加此wrap-->
		<div class="have_bar_wrap">
			<div class="model_recommend_tit flex_ca">
				<a href="javascript:void(0)"><span>区域</span><i class="iconfont icon-xuanzeqizhankai"></i><input id="quyu" type="" name="" value="" readonly=""></a>
				<a href="javascript:void(0)"><span>类别</span><i class="iconfont icon-xuanzeqizhankai"></i><input id="leibie" type="" name="" value="" readonly=""></a>
				<!--<a href="javascript:void(0)"><span>服务</span><i class="iconfont icon-xuanzeqizhankai"></i><input id="fuwu" type="" name="" value="" readonly=""></a>-->
			</div>
			<!--活动通告列表-->
			<div class="yp_info">
				<div class="main_box">
					<div class="yp_info_tit flex_cc">
						<img class="yp_info_tit_head" src="static/images/changkuan21.png">
						<div class="yp_info_tit_mid">
							<div class="yp_info_tit_mid_top flex_cl">
								<span>王小宇</span>
								<i class="iconfont icon-man"></i>
								<b class="real_name_icon">已实名</b>
								<b class="guarantee_icon">信用担保</b>
							</div>
							<div class="yp_info_tit_mid_bottom">
								<span>摄影师</span>
							</div>
						</div>
						<div class="yp_info_tit_r flex_cc">
							<i class="iconfont icon-weizhi1"></i>
							<span>杭州</span>
						</div>
					</div>
					<div class="yp_info_subtit flex_cl">
						<span class="subtit_type subtit_type_green">活动通知</span>
						<p>杭州魔法空间百万年薪招募新模</p>
					</div>
					<div class="activity_list flex_cl">
						<i class="iconfont icon-sound"></i>
						<p>线上活动·网络推广</p>
					</div>
					<div class="activity_list flex_cl">
						<i class="iconfont icon-time-circle"></i>
						<p>2019.8.8~2019.8.31</p>
					</div>
					<div class="activity_list flex_cb">
						<div class="flex_cl">
							<i class="iconfont icon-weizhi1"></i>
							<p>不限</p>
							<i class="iconfont icon-team"></i>
							<p>30人</p>
						</div>
						<div class="activity_list_r">100000<span>元/人</span></div>
					</div>
					<div class="activity_list_all">
						已有<span>8</span>人报名
					</div>
					<div class="activity_list_headlist">
						<img src="static/images/changkuan21.png">
						<img src="static/images/changkuan21.png">
						<img src="static/images/changkuan21.png">
						<img src="static/images/changkuan21.png">
						<img src="static/images/changkuan21.png">
						<img src="static/images/changkuan21.png">
						<img src="static/images/changkuan21.png">
						<img src="static/images/changkuan21.png">
						<img src="static/images/changkuan21.png">
					</div>
				</div>
			</div>
			<div class="yp_info">
				<div class="main_box">
					<div class="yp_info_tit flex_cc">
						<img class="yp_info_tit_head" src="static/images/changkuan21.png">
						<div class="yp_info_tit_mid">
							<div class="yp_info_tit_mid_top flex_cl">
								<span>王小宇</span>
								<i class="iconfont icon-man"></i>
								<b class="real_name_icon">已实名</b>
								<b class="guarantee_icon">信用担保</b>
							</div>
							<div class="yp_info_tit_mid_bottom">
								<span>摄影师</span>
							</div>
						</div>
						<div class="yp_info_tit_r flex_cc">
							<i class="iconfont icon-weizhi1"></i>
							<span>杭州</span>
						</div>
					</div>
					<div class="yp_info_subtit flex_cl">
						<span class="subtit_type subtit_type_green">活动通知</span>
						<p>杭州魔法空间百万年薪招募新模</p>
					</div>
					<div class="activity_list flex_cl">
						<i class="iconfont icon-sound"></i>
						<p>线上活动·网络推广</p>
					</div>
					<div class="activity_list flex_cl">
						<i class="iconfont icon-time-circle"></i>
						<p>2019.8.8~2019.8.31</p>
					</div>
					<div class="activity_list flex_cb">
						<div class="flex_cl">
							<i class="iconfont icon-weizhi1"></i>
							<p>杭州地区</p>
							<i class="iconfont icon-team"></i>
							<p>30人</p>
						</div>
						<div class="activity_list_r">100000<span>元/人</span></div>
					</div>
					<div class="activity_list_all">
						已有<span>8</span>人报名
					</div>
					<div class="activity_list_headlist">
						<img src="static/images/changkuan21.png">
						<img src="static/images/changkuan21.png">
						<img src="static/images/changkuan21.png">
						<img src="static/images/changkuan21.png">
						<img src="static/images/changkuan21.png">
						<img src="static/images/changkuan21.png">
						<img src="static/images/changkuan21.png">
						<img src="static/images/changkuan21.png">
						<img src="static/images/changkuan21.png">
					</div>
				</div>
			</div>
			<!--底部切换bar-->
			<div class="footer_bar">
				<a class="bar_index footer_bar_action" href="javascript:void(0)"><i></i>首页</a>
				<a class="bar_screen" href="javascript:void(0)"><i></i>筛选</a>
				<a href="javascript:void(0)">
					<div class="bar_fabu_in"><i class="iconfont icon-jiahao"></i></div>
				</a>
				<a class="bar_msg" href="javascript:void(0)"><i></i>消息</a>
				<a class="bar_my" href="my.html"><i></i>我的</a>
			</div>
		</div>
		<script type="text/javascript">
			$(function() {
				var yuepailist = new Swiper('.yp_swiper', {
					slidesPerView: 'auto',
					spaceBetween: 10,
					speed: 300,
				})
				/*约拍地图*/
				var yuepailist = new Swiper('.yp_map_img', {
					loop: true, // 循环模式选项
					autoplay: {
						delay: 3000,
						disableOnInteraction: false,
					},
					spaceBetween: 0,
					speed: 1000,
				})
				$("#quyu").cityPicker({
					title: "请选择地区域",
					showDistrict: false,
					onClose: function(d) {
						console.log(this, d)
						city = (this, d.displayValue);
						alert(JSON.stringify(city))
						$("#quyu").siblings("span").text(city[0] + " " + city[1])
					}
				});
				$("#leibie").picker({
					title: "请选择您的活动类别",
					cols: [{
						textAlign: 'center',
						values: ['展会活动', '摄影活动', '走秀活动', '赛事活动', '广告拍摄', '礼仪活动', '影视拍摄', '直播活动', '活动主持', '商务公关', '其他']
					}],
					onClose: function(d) {
						val = (this, d.displayValue);
						alert(JSON.stringify(val));
					}
				});
				$("#fuwu").picker({
					title: "请选择服务",
					cols: [{
						textAlign: 'center',
						values: ['拍服装', '拍产品', '其他']
					}],
					onClose: function(d) {
						val = (this, d.displayValue);
						alert(JSON.stringify(val))
						$("#fuwu").siblings("span").text(val[0])
					}
				});
			})
		</script>
	</body>

</html>